<template>
  <header class="header">
    <h1>todos</h1>
    <input v-model="isAlls" id="toggle-all" class="toggle-all" type="checkbox" >
    <label for="toggle-all"></label>
    <input
        @keydown.enter="enterDown"
        v-model.trim="huiEnter"
      class="new-todo"
      placeholder="输入任务名称-回车确认"
      autofocus
    />
  </header>
</template>

<script>
//全选小选
//1 ，先将list传过来
//2.在定义属性 issel
//在父组建上面定义list接收

//在下面计算属性传给父值
//issel 不是函数是对象
export default {
    props:['list'],
    data(){
        return{
            huiEnter:""
        }
    },
    methods:{
        enterDown(){
            if(this.huiEnter==''){
                return alert('不能为空')
            }
            this.$emit('huiTer', this.huiEnter)
            this.huiEnter=''
        },
        
    },
    computed:{
        isAlls:{

            //只是操作了数组里面的元素 并不是修改元素
            // /实现全选
            set(val){
                this.list.forEach(item=>item.isDone=val)
            },
                //实现小选
            get(){
                  //get 同样要返回一个属性
            return this.list.every(item=>item.isDone)
            }
        }
    }
    
 
}
</script>